<template>
  <div class="Brand">
    <div class="title">品牌制造商直供</div>
    <ul class="brands">
        <li v-for="(item,index) in brandList" :key="index">
            <img :src="item.pic_url" alt="">
            <h2>{{item.name}}</h2>
            <p>{{item.floor_price | RMBFormat}}</p>
        </li>
    </ul>
  </div>
</template>

<script>
export default {
  props:['brandList'],
  components: {},
  data() {
    return {};
  },
  computed: {},
  created() {},
  mounted() {},
  methods: {},
};
</script>

<style lang='less' scoped>
.Brand {
  margin-top: 0.15rem;
  background-color: #fff;
  .title {
    text-align: center;
    height: 0.5rem;
    line-height: 0.5rem;
    font-size: 0.2rem;
  }

  .brands{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    li{
        position: relative;
        width: 49%;
        img{
            width: 100%;
        }

        h2{
            position: absolute;
            top: 0.1rem;
            left: 0.1rem;
        }

        p{
            position: absolute;
            top: 0.4rem;
            left: 0.1rem;
            color: #8b0000;
        }
    }
  }
}
</style>
